import {createRouter, createWebHistory} from "vue-router";
import store from "../store/index.js";

const routes = [
    {
        name: "布局框架",
        path: "/",
        component: () => import("../layouts/BasicLayout.vue"),
        children: [
            // 重定向首页
            {
                path: "/",
                redirect: "/find"
            },
            {
                // 首页
                name: "发现",
                path: "find",
                component: () => import("../pages/find/Find.vue"),
                meta: {
                    keepAlive: true    //需要缓存
                },
            },
            {
                name: "我的",
                path: "my",
                component: () => import("../pages/my/My.vue"),
                meta: {
                    keepAlive: true    //需要缓存
                },
            }, {
                name: "播客",
                path: "podcast",
                component: () => import("../pages/podcast/Podcast.vue"),
            },

        ]
    },
    {
        name: "布局框架2",
        path: "/b2",
        component: () => import("../layouts/Basic2Layout.vue"),
        children: [
            {
                name: "歌手分类",
                path: "singer",
                component: () => import("../pages/singer/SingerCategory.vue"),
                meta: {
                    keepAlive: true    //需要缓存
                },
            },
            {
                name: "歌单",
                path: "songsheet/:id",
                component: () => import("../pages/song/SongSheetDetail.vue"),
            },
            {
                name: "歌手详情",
                path: "singerdetail/:id",
                component: () => import("../pages/singer/SingerDetail.vue"),
            },
            {
                name: "歌单分类",
                path: "SongListClassIf",
                component: () => import("../pages/song/SongListClassIf.vue"),
            },
        ]
    },

    {
        name: "登录",
        path: "/login",
        component: () => import("../pages/Login.vue")
    },
    {
        name: "搜索",
        path: "/search",
        component: () => import("../pages/search/Search.vue")
    }
];

// const routes = [
//     {
//         name: "b",
//         path: "/b",
//         component: () => import("../pages/b.vue"),
//         meta: {
//                     keepAlive: true    //需要缓存
//                 },
//     },
//     {
//         name: "c",
//         path: "/c",
//         component: () => import("../pages/c.vue"),
//         meta: {
//             keepAlive: true    //需要缓存
//         },
//     },
//     {
//         name: "d",
//         path: "/d",
//         component: () => import("../pages/d.vue")
//     },
// ]
const router = createRouter({
    routes,
    history: createWebHistory(),
    /*    scrollBehavior(to, from, savedPosition) {
            if (savedPosition) {
                console.log(savedPosition)
                return savedPosition
            } else {
                return {x: 0, y: 0} //期望滚动到哪个的位置
            }
        },*/
})
router.beforeEach((to, form, next) => {
        next()
    }
)
// router.afterEach() 进入之后触发
router.afterEach((to,form) => {
    // 需要缓存滚动高度
    if(form.meta.keepAlive) {
        store.commit("setScrolls",{path:form.fullPath,data:document.querySelector('.need-scroll').scrollTop})
    }
    // console.log(need)
})
export default router